<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>查看相片状态</title>
    <link rel="stylesheet" th:href="@{/webjars/bootstrap/3.3.7/css/bootstrap.css}">
    <link rel="stylesheet" th:href="@{/bootstrap-table.css}">
    <script type="text/javascript" th:src="@{/webjars/jquery/3.3.1/jquery.js}"></script>
    <script type="text/javascript" th:src="@{/webjars/bootstrap/3.3.7/js/bootstrap.js}"></script>
    <script type="text/javascript" th:src="@{/bootstrap-table.js}"></script>
    <script type="text/javascript" th:src="@{/bootstrap-table-locale-all.js}"></script>
    <script type="text/javascript" th:src="@{/bootstrap-table-zh-CN.js}"></script>
</head>
<body>
    <button id="noOk" value="-1">未通过</button ><button id="beginOk" value="0">待审核</button><button id="isOk" value="1">已通过</button>
    <table id="table"></table>
</body>


    <script type="text/javascript">
        $(function(){
           $("#noOk").click(function(){
               var $noOkV = $(this).val();
               $('#table').bootstrapTable('destroy');
               //创建bootstrapTable
               $("#table").bootstrapTable({
                   method:"POST",
                   //极为重要，缺失无法执行queryParams，传递page参数
                   contentType : "application/x-www-form-urlencoded",
                   dataType:"json",
                   url:'queryTbPhotoLibrariesByOk/'+$noOkV,
                   queryParams:queryParam,
                   pagination:true,//显示分页条：页码，条数等
                   striped:true,//隔行变色
                   pageNumber:1,//首页页码
                   pageSize:10,//分页，页面数据条数
                   uniqueId:"id",//Indicate an unique identifier for each row
                   sidePagination:"server",//在服务器分页
                   responseHandler:responseHandler,
                   height:500,
                   toolbar:"#toolbar",//工具栏
                   columns : [{
                       checkbox:"true",
                       field : "box"
                   },  {
                       title : "编号",
                       field : "id",//(拿实体类的属性)
                       visible: false //(隐藏)
                   },  {
                       title : "相册编号",
                       field : "albumId",//(拿实体类的属性)
                       visible: false //(隐藏)
                   }, {
                       title : "图片路径",
                       field : "photoUrl",
                       visible: false //(隐藏)
                   }, {
                       title : "所属用户",
                       field : "user.nickName"
                   },{
                       title : '图片',
                       field : 'photoUrl',
                       align : 'center',
                       formatter:function (value,row,index) {
                           return '<img  src='+value+' style="width:50px;height:50px;"/>';
                       }
                   }, {
                       title : "上传时间",
                       field : "createTime"
                   },{
                       field : 'operate',
                       title : '操作',
                       formatter:function(value, row, index){
                           return '<button name="passPhoto" class="btn btn btn-danger btn-sm" onClick="passPhoto(\''+row.id+'\',\''+row.albumId+'\');"><span class="glyphicon glyphicon-trash">&nbsp;</span>通过</button>'+
                               ' <button name="noPassPhoto" class="btn btn-info btn-sm" onClick="checkPassPhoto(\''+row.id+'\',\''+row.albumId+'\');"><span class="glyphicon glyphicon-random">&nbsp;</span>待审核</button>';
                       }
                   }],
                   showRefresh : true,//刷新
               });
           });

            $("#beginOk").click(function(){
                var  $beginOk= $(this).val();

                $('#table').bootstrapTable('destroy');
                //创建bootstrapTable
                $("#table").bootstrapTable({
                    method:"POST",
                    //极为重要，缺失无法执行queryParams，传递page参数
                    contentType : "application/x-www-form-urlencoded",
                    dataType:"json",
                    url:'queryTbPhotoLibrariesByOk/'+$beginOk,
                    queryParams:queryParam,
                    pagination:true,//显示分页条：页码，条数等
                    striped:true,//隔行变色
                    pageNumber:1,//首页页码
                    pageSize:10,//分页，页面数据条数
                    uniqueId:"id",//Indicate an unique identifier for each row
                    sidePagination:"server",//在服务器分页
                    responseHandler:responseHandler,
                    height:500,
                    toolbar:"#toolbar",//工具栏
                    columns : [{
                        checkbox:"true",
                        field : "box"
                    },  {
                        title : "编号",
                        field : "id",//(拿实体类的属性)
                        visible: false //(隐藏)
                    },  {
                        title : "相册编号",
                        field : "albumId",//(拿实体类的属性)
                        visible: false //(隐藏)
                    }, {
                        title : "图片路径",
                        field : "photoUrl",
                        visible: false //(隐藏)
                    }, {
                        title : "所属用户",
                        field : "user.nickName"
                    },{
                        title : '图片',
                        field : 'photoUrl',
                        align : 'center',
                        formatter:function (value,row,index) {
                            return '<img  src='+value+' style="width:50px;height:50px;"/>';
                        }
                    }, {
                        title : "上传时间",
                        field : "createTime"
                    },{
                        field : 'operate',
                        title : '操作',
                        formatter:function(value, row, index){
                            return '<button name="passPhoto" class="btn btn btn-danger btn-sm" onClick="passPhoto(\''+row.id+'\',\''+row.albumId+'\');"><span class="glyphicon glyphicon-trash">&nbsp;</span>通过</button>'+
                                ' <button name="noPassPhoto" class="btn btn-info btn-sm" onClick="noPassPhoto(\''+row.id+'\',\''+row.albumId+'\');"><span class="glyphicon glyphicon-random">&nbsp;</span>不通过</button>';
                        }
                    }],
                    showRefresh : true,//刷新
                });
            });

                       function responseHandler(res) {
                console.log(res);
                console.log(res.result.list);
                if (res.errorCode=='OK') {
                    return {
                        "rows" : res.result,
                        "total" : res.result.total
                    };
                } else {
                    return {
                        "rows" : [],
                        "total" : 0
                    };
                }
            }
            function queryParam(params) {
                var param = {
                    limit : this.limit, // 页面大小
                    offset : this.offset, // 页码
                    pageNumber : this.pageNumber,
                    pageSize : this.pageSize
                };
                return param;
            }



            $("#isOk").click(function(){
                var $isOk = $(this).val();
                $('#table').bootstrapTable('destroy');
                //创建bootstrapTable
                $("#table").bootstrapTable({
                    method:"POST",
                    //极为重要，缺失无法执行queryParams，传递page参数
                    contentType : "application/x-www-form-urlencoded",
                    dataType:"json",
                    url:'queryTbPhotoLibrariesByOk/'+$isOk,
                    queryParams:queryParam,
                    pagination:true,//显示分页条：页码，条数等
                    striped:true,//隔行变色
                    pageNumber:1,//首页页码
                    pageSize:10,//分页，页面数据条数
                    uniqueId:"id",//Indicate an unique identifier for each row
                    sidePagination:"server",//在服务器分页
                    responseHandler:responseHandler,
                    height:500,
                    toolbar:"#toolbar",//工具栏
                    columns : [{
                        checkbox:"true",
                        field : "box"
                    },  {
                        title : "编号",
                        field : "id",//(拿实体类的属性)
                        visible: false //(隐藏)
                    },  {
                        title : "相册编号",
                        field : "albumId",//(拿实体类的属性)
                        visible: false //(隐藏)
                    }, {
                        title : "图片路径",
                        field : "photoUrl",
                        visible: false //(隐藏)
                    }, {
                        title : "所属用户",
                        field : "user.nickName"
                    },{
                        title : '图片',
                        field : 'photoUrl',
                        align : 'center',
                        formatter:function (value,row,index) {
                            return '<img  src='+value+' style="width:50px;height:50px;"/>';
                        }
                    }, {
                        title : "上传时间",
                        field : "createTime"
                    },{
                        field : 'operate',
                        title : '操作',
                        formatter:function(value, row, index){
                            return '<button name="passPhoto" class="btn btn btn-danger btn-sm" onClick="noPassPhoto(\''+row.id+'\',\''+row.albumId+'\');"><span class="glyphicon glyphicon-trash">&nbsp;</span>不通过</button>'+
                                ' <button name="noPassPhoto" class="btn btn-info btn-sm" onClick="checkPassPhoto(\''+row.id+'\',\''+row.albumId+'\');"><span class="glyphicon glyphicon-random">&nbsp;</span>待审核</button>';
                        }
                    }],
                    showRefresh : true,//刷新
                });

            });
        });
        function passPhoto(photoId,albumId) {
            var isPass = 1;
            $.ajax({
                url:"/savePassPhoto/"+photoId+"_"+albumId+"_"+isPass,
                method:"POST",
                dataType:"json",
                success:function(dt){
                    console.log(dt);
                    $("#table").bootstrapTable("refresh");
                }
            });

        }


        function noPassPhoto(photoId,albumId) {
            var noPass =-1;
            $.ajax({
                url:"/savePassPhoto/"+photoId+"_"+albumId+"_"+noPass,
                method:"POST",
                dataType:"json",
                success:function(dt){
                    console.log(dt);
                }
            });
        }

        function checkPassPhoto(photoId,albumId) {
            var checkPass =0;
            $.ajax({
                url:"/savePassPhoto/"+photoId+"_"+albumId+"_"+checkPass,
                method:"POST",
                dataType:"json",
                success:function(dt){
                    console.log(dt);
                }
            });
        }

    </script>

</html>